﻿@page "/mine"
@using SwashbucklerDiary.Models
@namespace SwashbucklerDiary.Pages
@inherits ImportantComponentBase

<MyAppBar>
    <MToolbarTitle Class="font-weight-bold"
                   Style="width:100%;">
        @(I18n.T("Mine.Mine"))
    </MToolbarTitle>
    <MSpacer></MSpacer>
    <MultiSearchControl OnSearch="Search">
    </MultiSearchControl>
</MyAppBar>

<ScrollContainer>
    <div class="d-sm-flex flex-sm-row justify-space-between">
        <MHover>
            <MCard @attributes="context.Attrs"
                   Class="@($"setting-info mb-5 py-sm-3 py-md-5 {(context.Hover?"elevation-sm-2":"")}")"
                   Elevation="0"
                   Rounded="@("lg")"
                   Ripple="false"
                   OnClick="@(()=>To("user"))">
                <MList>
                    <MListItem ThreeLine>
                        <MListItemAvatar Class="ml-sm-2 ml-md-4 mr-md-6"
                                         Rounded="@("lg")"
                                         Size="70"
                                         @onclick:stopPropagation="true">
                            <MImage Src="@(Avatar)" @onclick="()=>ShowPreviewImage=true">
                                <PlaceholderContent>
                                    <MRow Class="fill-height ma-0"
                                          Align="@AlignTypes.Center"
                                          Justify="@JustifyTypes.Center">
                                        <MProgressCircular Indeterminate="true">
                                        </MProgressCircular>
                                    </MRow>
                                </PlaceholderContent>
                            </MImage>
                        </MListItemAvatar>
                        <MListItemContent>
                            <MListItemTitle Class="text-h6 font-weight-bold">
                                @(UserName)
                            </MListItemTitle>
                            <MListItemSubtitle>
                                @(Sign)
                            </MListItemSubtitle>
                        </MListItemContent>
                        <MListItemAction Style="align-self:unset;">
                            <MIcon>mdi-chevron-right</MIcon>
                        </MListItemAction>
                    </MListItem>
                </MList>
            </MCard>
        </MHover>

        <MCard Class="setting-info mb-5 ml-sm-5 d-flex"
               Elevation="0"
               Rounded="@("lg")">
            <MList Class="d-flex flex-grow-1">
                <MListItem>
                    <MListItemContent Class="justify-space-around text-center">
                        <div style="flex:unset">
                            <MListItemSubtitle>
                                @(I18n.T("Statistics.DiaryCount"))
                            </MListItemSubtitle>
                            <MListItemTitle Class="mt-2 font-weight-bold text-h6">
                                @DiaryCount
                            </MListItemTitle>
                        </div>
                        <div style="flex:unset">
                            <MListItemSubtitle>
                                @(I18n.T("Statistics.WordCount"))
                            </MListItemSubtitle>
                            <MListItemTitle Class="mt-2 font-weight-bold text-h6">
                                @WordCount
                            </MListItemTitle>
                        </div>
                        <div style="flex:unset">
                            <MListItemSubtitle>
                                @(I18n.T("Statistics.ActiveDayCount"))
                            </MListItemSubtitle>
                            <MListItemTitle Class="mt-2 font-weight-bold text-h6">
                                @ActiveDayCount
                            </MListItemTitle>
                        </div>
                    </MListItemContent>
                </MListItem>
            </MList>
        </MCard>
    </div>

    @foreach (var list in ViewLists)
    {
        <div class="text-h6 setting-title">
            @(I18n.T(list.Key))
        </div>

        <MCard Class="setting-card"
               Elevation="0"
               Rounded="@("lg")">
            <MList>
                @foreach (var item in list.Value)
                {
                    <MListItem OnClick="()=>item.OnClick.InvokeAsync()">
                        <MListItemIcon>
                            <MIcon Class="list-item-icon">
                                @(item.Icon)
                            </MIcon>
                        </MListItemIcon>
                        <MListItemContent>
                            @(I18n.T(item.Text))
                        </MListItemContent>
                        <MListItemAction>
                            <MIcon>mdi-chevron-right</MIcon>
                        </MListItemAction>
                    </MListItem>

                    if (list.Value.Last() != item)
                    {
                        <MDivider Class="mx-3"></MDivider>
                    }
                }

            </MList>
        </MCard>
    }

</ScrollContainer>

<RadioDialog @bind-Value="ShowLanguage"
             Title="@(I18n.T("Mine.SelectLanguage"))"
             ItemValue="Language"
             TItemValue="string"
             ItemValueChanged="LanguageChanged"
             Items="I18n.Languages">
</RadioDialog>

<RadioDialog @bind-Value="ShowThemeState"
             Title="@(I18n.T("Mine.Night"))"
             ItemValue="ThemeState"
             TItemValue="ThemeState"
             ItemValueChanged="ThemeStateChanged"
             Items="ThemeStates">
</RadioDialog>

<MultiListDialog @bind-Value="ShowFeedback"
                 Title="@(I18n.T("Mine.ContactWay"))"
                 DynamicListItems="FeedbackTypes">
</MultiListDialog>

<PreviewImageDialog @bind-Value="ShowPreviewImage"
                    Src="@Avatar">
</PreviewImageDialog>
